export function HelloWorld ({greeting = "hello", greeted = "\"World\"", silent = false, onMouseOver}) {

    if (!greeting) {

        return null;

    }

    // TODO: Don't use random in render
    let num = Math.floor(Math.random() * 1E+7).toString().
        replace(
            /\.\d+/ig,
            ""
        );

    return <div className='HelloWorld' title={`You are visitor number ${num}`} onMouseOver={onMouseOver}>
        <strong>{ greeting.slice(
            0,
            1
        ).toUpperCase() + greeting.slice(1).toLowerCase() }</strong>
        {greeting.endsWith(",")
            ? " "
            : <span style={{"color": "\grey"}}>", "</span> }
        <em>
            { greeted }
        </em>
        { silent
            ? "."
            : "!"}
    </div>;

}